<template>
  <div>
    <el-dialog :title="fieldPreviewDialog.title" :visible.sync="fieldPreviewDialog.show" width="55%" destroy-on-close @close='closeDialog' @open='openDialog'
               :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="false">

    <el-card style="margin-top: 10px">
    <el-table ref="table" :data="tableData" style="width: 100%" row-key="id" lazy>>
        <el-table-column type="index" label="#" width="55"> </el-table-column>
        <el-table-column prop="columnName" label="字段名"> </el-table-column>
        <el-table-column prop="comments" label="注释" align="center"></el-table-column>
        <el-table-column prop="columnType" label="字段类型" align="center"></el-table-column>
        <el-table-column prop="javaType" label="JAVA类型" align="center"></el-table-column>
    </el-table>
    </el-card>
    <!-- 分页 -->
    <pagination :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList"/>
    </el-dialog>
  </div>
</template>

<script>

import { getTableInfoPageList } from "@/api/system/dataSource";
import Pagination from "@/components/Pagination"; // el分页

export default {
  props: ['fieldPreviewDialog', 'formData'],
  data() {
    return {
      tableData: [],
      //条件查询搜索
      total: 0,
      listQuery: {
        current: 1,
        size: 10,
        tableName: undefined,
        dsName: undefined,
      },
    }
  },
  methods: {
    // 弹窗打开触发的方法
    openDialog() {
        this.listQuery.tableName = this.formData.tableName;
        this.listQuery.dsName = this.formData.dsName;
        this.getList();
    },
    // 弹窗关闭触发的方法
    closeDialog() {

    },
    getList() {
        getTableInfoPageList(this.listQuery).then((res) => {
            this.tableData = res.data.records;
            this.total = res.data.total;
            this.listQuery.current = res.data.current;
            this.listQuery.size = res.data.size;
            setTimeout(() => {
            this.listLoading = false;
            }, 1.5 * 1000);
        });
    },
  },
  components: {
    Pagination,
  },
}
</script>

<style lang="sass" scoped>
</style>